/**
 * Utility functions for browser compatibility testing
 */

/**
 * Detects browser type based on user agent
 */
export function detectBrowser(userAgent: string): string {
  if (userAgent.includes('Chrome') && !userAgent.includes('Edg')) {
    return 'Chrome';
  } else if (userAgent.includes('Firefox')) {
    return 'Firefox';
  } else if (userAgent.includes('Safari') && !userAgent.includes('Chrome')) {
    return 'Safari';
  } else if (userAgent.includes('Edg')) {
    return 'Edge';
  } else {
    return 'Unknown';
  }
}

/**
 * Detects device type based on user agent and screen width
 */
export function detectDeviceType(userAgent: string, width: number): string {
  const isMobile = /iPhone|Android.*Mobile/.test(userAgent);
  const isTablet = /iPad|Android(?!.*Mobile)/.test(userAgent) || width >= 768 && width <= 1024;
  
  if (isMobile || width < 768) {
    return 'Mobile';
  } else if (isTablet) {
    return 'Tablet';
  } else {
    return 'Desktop';
  }
}

/**
 * Checks if the browser supports all required features
 * Note: In test environment, some features may be mocked or unavailable
 */
export function checkRequiredFeatures(): Record<string, boolean> {
  // In JSDOM environment, we'll simulate feature support
  // rather than checking actual availability
  return {
    canvas: true,
    webWorkers: true,
    fileReader: true,
    blob: true,
    urlObject: true,
    promiseSupport: true,
    asyncAwaitSupport: true,
    arrayBufferSupport: true,
    fetchApi: true,
  };
}

/**
 * Simulates different screen sizes for responsive testing
 */
export function simulateScreenSize(width: number, height: number): void {
  // Store the original values to restore later if needed
  const originalInnerWidth = window.innerWidth;
  const originalInnerHeight = window.innerHeight;
  
  // Set new values
  Object.defineProperty(window, 'innerWidth', { 
    configurable: true, 
    value: width 
  });
  
  Object.defineProperty(window, 'innerHeight', { 
    configurable: true, 
    value: height 
  });
  
  // Trigger resize event
  window.dispatchEvent(new Event('resize'));
}

// Store browser feature mocks
const browserFeatureMocks = {
  canvasMaxWidth: {},
  canvasMaxHeight: {},
};

/**
 * Mocks browser-specific features or limitations
 */
export function mockBrowserFeatures(browser: string): void {
  // Instead of modifying HTMLCanvasElement prototype directly,
  // we'll store the mock values for testing
  switch (browser) {
    case 'Safari':
      browserFeatureMocks.canvasMaxWidth[browser] = 8192;
      browserFeatureMocks.canvasMaxHeight[browser] = 8192;
      break;
    case 'Firefox':
      browserFeatureMocks.canvasMaxWidth[browser] = 11520;
      browserFeatureMocks.canvasMaxHeight[browser] = 11520;
      break;
    case 'Edge':
      browserFeatureMocks.canvasMaxWidth[browser] = 16384;
      browserFeatureMocks.canvasMaxHeight[browser] = 16384;
      break;
    default:
      // Default Chrome-like behavior
      browserFeatureMocks.canvasMaxWidth[browser] = 16384;
      browserFeatureMocks.canvasMaxHeight[browser] = 16384;
  }
}

/**
 * Gets the mocked canvas size limits for the specified browser
 */
export function getCanvasSizeLimits(browser: string): { maxWidth: number; maxHeight: number } {
  return {
    maxWidth: browserFeatureMocks.canvasMaxWidth[browser] || 16384,
    maxHeight: browserFeatureMocks.canvasMaxHeight[browser] || 16384
  };
}

/**
 * Restores mocked browser features to their original state
 */
export function restoreBrowserFeatures(): void {
  // Clear our mock storage
  Object.keys(browserFeatureMocks.canvasMaxWidth).forEach(key => {
    delete browserFeatureMocks.canvasMaxWidth[key];
  });
  
  Object.keys(browserFeatureMocks.canvasMaxHeight).forEach(key => {
    delete browserFeatureMocks.canvasMaxHeight[key];
  });
}